import React, { useState } from 'react';
import { Row, Col, Modal } from 'antd';
import SubmissionList from './SubmissionList';
import SubmissionDetail from './SubmissionDetail';
import './JudgeCenter.less';

interface JudgeCenterProps {
  userId?: number;
  problemId?: string;
  defaultSubmitId?: number; // 默认显示的提交ID，用于从提交成功后跳转
}

const JudgeCenter: React.FC<JudgeCenterProps> = ({ 
  userId = 1, 
  problemId,
  defaultSubmitId 
}) => {
  const [selectedSubmitId, setSelectedSubmitId] = useState<number | null>(defaultSubmitId || null);
  const [detailModalVisible, setDetailModalVisible] = useState(!!defaultSubmitId);

  // 处理查看提交详情
  const handleViewSubmission = (submitId: number) => {
    setSelectedSubmitId(submitId);
    setDetailModalVisible(true);
  };

  // 关闭详情模态框
  const handleCloseDetail = () => {
    setDetailModalVisible(false);
    setSelectedSubmitId(null);
  };

  return (
    <div className="judge-center">
      <Row gutter={[16, 16]}>
        <Col span={24}>
          <SubmissionList
            userId={userId}
            problemId={problemId}
            onViewSubmission={handleViewSubmission}
          />
        </Col>
      </Row>

      {/* 提交详情模态框 */}
      <Modal
        title={null}
        open={detailModalVisible}
        onCancel={handleCloseDetail}
        footer={null}
        width="90%"
        style={{ top: 20 }}
        destroyOnClose
      >
        {selectedSubmitId && (
          <SubmissionDetail
            submitId={selectedSubmitId}
            visible={detailModalVisible}
            onClose={handleCloseDetail}
          />
        )}
      </Modal>
    </div>
  );
};

export default JudgeCenter;